var $div;  // dtree 选中之后节点对应的dom元素
var cateTree;
layui.extend({
    dtree: '/layui/lay/exts/dtree'   // {/}的意思即代表采用自有路径，即不跟随 base 路径
}).use(['dtree', 'layer', 'jquery', 'form'], function () {
    var dtree = layui.dtree, layer = layui.layer, $ = layui.jquery;
    var form = layui.form;

    // 初始化树
    cateTree = dtree.render({
        elem: "#CategoryTree",
        url: "http://localhost:8080/api/Categorys",
        method: 'GET',
        toolbar: true,
        //toolbarBtn: [],
        toolbarShow: [], // 默认按钮制空
        toolbarExt: [{   // 右键菜单
                toolbarId: "add", icon: "dtree-icon-wefill", title: "新增类别", handler: function (node, $div) {
                console.log(node);
                var index = layer.open({
                    title: "新增类别",
                    type: 2,
                    content: "add.html",
                    area: ['550px', '300px'],
                    success: function (layero, index) { // 窗口打开之后执行
                        // 获取打开的窗口对象
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        console.log(iframeWin);
                        iframeWin.$div = $div;
                        iframeWin.parentId = node.nodeId;
                        iframeWin.parentName = node.context;
                    }
                })
                //layer.full(index);  // 弹出的子窗口全屏
                }
            }, {
                toolbarId: "delete", icon: "dtree-icon-wefill", title: "删除", handler: function (node, $div) {
                    layer.confirm('确定要删除“' + node.context + '”吗？', { icon: 3, title: '提示' }, function (index) {
                        $.ajax({
                            url: 'http://localhost:8080/api/categorys/' + node.nodeId,
                            method:'delete',
                            success: function (result) {
                                layer.close(index);
                                cateTree.partialRefreshDel($div);  // 刷新选中节点
                            }
                        })
                    });
                }
            }],
        dataStyle: "layuiStyle",  //使用layui风格的数据格式
        dataFormat: "list",  //配置data的风格为list
        response: { message: "msg", statusCode: 0 },  //修改response中返回数据的定义
        accordion: true,
        ficon: ["1", "-1"],  // 隐藏一级图标
        line: true, // 无树线
        icon: ["0", "5"] // 设定二级图标样式。0表示文件夹图标，5表示叶子图标
    });

    //dtree事件监听
    dtree.on("node('CategoryTree')", function (obj) {
        console.log(obj);
        // console.log(obj.param);
        console.log($(obj.dom));
        $div = $(obj.dom);  // 选中的dtree节点对应的dom对象
        $('input[name="Name"]').val(obj.param.context);
        $('input[name="Id"]').val(obj.param.nodeId);

        if (obj.param.parentId == "-1") {
            $('input[name="ParentName"]').val('无');
            $('input[name="ParentId"]').val('0');
        } else {
            $('input[name="ParentId"]').val(obj.param.parentId);
            $('input[name="ParentName"]').val(obj.parentParam.context)
        }
        
    });

    // 提交表单
    form.on('submit(save)', function (data) {
        var category = form.val("cateForm");  // 获取表单数据
        console.log(category);
        $.ajax({
            url: "http://localhost:8080/api/Categorys",
            type: 'put',
            data: category,
            success: function (rst) {
                $div.find('cite').html(category.Name); // 修改dree选中节点
                layer.msg('修改完成！');
            }
        })
        return false;
    })
})